<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>我的</title>
</head>

<body class="df fdc">
    <div class=" f1 ofs main-container">
        <!-- 轮播图 -->
        <section class="swipperBox">
            <div class="swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <img src="../../assets/imgs/index-swiper-bg1.jpg" alt="" class="swipbg">
                    </div>
                    <div class="swiper-slide">
                        <img src="../../assets/imgs/index-swiper-bg2.jpg" alt="" class="swipbg">
                    </div>
                    <div class="swiper-slide">
                        <img src="../../assets/imgs/index-swiper-bg3.jpg" alt="" class="swipbg">
                    </div>
                </div>
                <!-- 如果需要分页器 -->
                <div class="swiper-pagination"></div>
            </div>
        </section>
        <!-- 用户名 -->
        <section class="uname">
            <a href="./desc.html"></a>
            <div class="usern df  fdc">
                <!-- 头像 -->
                <div class="df jcsb aic aa">
                    <div class="left df aic">
                        <img src="#" class="pho avatar" id="avatar">
                        <span class="iconfont icon-vip"></span>

                        <p id="nickName"></p>
                    </div>
                    <div class="right">
                        <span class="iconfont icon-xiangyou1"></span>
                    </div>
                </div>
                <!-- 个性签名 -->
                <div class="sign">
                    <p>个性签名: <span id="sign"></span></p>
                </div>


            </div>
        </section>
        <!-- 累计打卡 -->
        <section class="card df jcsb aic">
            <!-- 左边 -->
            <div class="left">
                <span class="iconfont icon-pintu1"></span>
                <span>累计打卡</span>
                <span id="number" class="num"></span>
                <span>天</span>
            </div>
            <!-- 今日打卡 -->
            <div class="right">
                <p>今日打卡</p>
            </div>
        </section>
        <!-- 个人动态 -->
        <section class="person df jcsb aic">
            <!-- 左边 -->
            <div class="left">
                <span class="iconfont icon-lianxitiguanli"></span>
                <span>个人动态</span>
            </div>
            <!-- 今日打卡 -->
            <div class="right df aic">
                <p><span id="circlesCount"></span> 条</p>
                <span class="iconfont icon-xiangyou1"></span>
            </div>
        </section>
        <!-- 运动数据 a-->
        <a href="./sportData.html" class="data">
            <div class="top df jcsb">
                <div class="l df">
                    <span class="iconfont icon-tubiao-zhuzhuangtu"></span>
                    <p>运动数据</p>
                </div>
                <div class="r">
                    <span class="iconfont icon-xiangyou1"></span>
                </div>
            </div>
            <div class="down df">
                <div class="l">
                    <p class="word">总运动</p>
                    <div class="df a1">
                        <p id="duration" class="num"></p><span class="mins">分钟</span>
                    </div>
                </div>
                <span class="mid"></span>
                <div class="r">
                    <p class="word">本周消耗</p>
                    <div class="df a1">
                        <p class="num" id="calorie"> </p><span class="mins">千卡</span>
                    </div>
                </div>
            </div>
        </a>
        <!-- 我的运动徽章 -->
        <a href="./badge.html" class="badge">
            <div class="top df jcsb">
                <div class="l df aic jcc">
                    <span class="iconfont icon-shezhi"></span>
                    <p>我的运动徽章</p>
                </div>
                <div class="r">
                    <span class="iconfont icon-xiangyou1"></span>
                </div>
            </div>
            <div class="down df jcsb">
                <img id="bages" src="#">
                <img id="bages" src="#">
                <img id="bages" src="#">
            </div>
        </a>
    </div>
</body>

</html>